<ui:composition xmlns="http://www.w3.org/1999/xhtml"
	xmlns:ui="http://java.sun.com/jsf/facelets"
	xmlns:h="http://java.sun.com/jsf/html"
	template="/template/template_dialog.xhtml">
	<ui:define name="head">
		<title>气象预警分析</title>
		<link
			href='#{request.contextPath}/resources/plugins/datatables/dataTables.bootstrap.css'
			rel='stylesheet' />
		<style>
.equipmentBtn {
	margin: 5px;
	background: #EEE9E9;
	color: #363636;
}

.equipmentSearchBtn {
	margin: 5px;
	background: orange;
	font-weight: bold;
}

.faultBtn {
	background: cornsilk;
	color: red;
}

#protects_filter {
	display: none;
}

.box-num {
	font-size: 30px;
	margin: 5px;
}
</style>
	</ui:define>
	<ui:define name="content">
		<div class="chart tab-pane active" id="baseInfo">
			<div class="col-sm-12" id="Disc">
				<div class="info-box bg-yellow">
					<span class="info-box-icon"><i id="typeIcon"></i></span>
					<div class="info-box-content" style="padding: 0;">
							<span id="areaDisc" class="info-box-text col-sm-11" style="font-size: 20px;padding-left: 20px;">加载中...</span>
							<span id="iconDiv" class="info-box-text col-sm-1" style="font-size: 20px;text-center:pull-right"></span>
					</div>
				</div>
			</div>
			<div class="col-sm-12" id="Meg" style="display: none;">
				<div class="info-box bg-yellow">
					<span class="info-box-icon"><i id="typeIcon2"></i></span>
					<div class="info-box-content" style="padding: 10px;">
						<div id="messaageDiv" style="margin-top: -5px;" class="col-sm-5 "></div>
						<div id="messaageDiv2" style="margin-top: -5px;" class="col-sm-6 "></div>
					</div>
				</div>
			</div>
			<div class="col-sm-12">
				<div class="box box-primary">
					<div class="box-header">
						<div class="box-title">一次设备</div>
						<div class="box-tools pull-right">
							<div id="linelegend">
								<button type="button" style="background-color: coral"
									class="btn btn-flat margin"></button>
								曾经故障设备
							</div>
						</div>
					</div>
					<div class="box-body">
						<table class="table table-bordered">
							<tr>
								<td style="width: 80px;">线路</td>
								<td id="lines">无</td>
							</tr>
							<tr>
								<td>变电站</td>
								<td id="stations">无</td>
							</tr>
						</table>
					</div>
				</div>
			</div>
			<div class="col-sm-12">
				<div class="box box-primary">
					<div class="box-header">
						<h3 class="box-title">目前处于异常状态的保护</h3>
					</div>
					<div class="box-body">
						<table id="protects" class="table table-gray"></table>

					</div>
				</div>
			</div>
		</div>
		<!-- <div id="messaageDiv" class="box-header with-border" style=" width:80%;  position: absolute; font-size: 14px;left:10px;top:20px; z-index:5"> </div>-->
		<h:inputHidden id="weatherWarningId"
			value="#{request.getParameter('weatherWarningId')}"></h:inputHidden>
	</ui:define>
	<ui:define name="contentend">
		<script
			src="#{request.contextPath}/resources/plugins/datatables/jquery.dataTables.js"></script>
		<script
			src="#{request.contextPath}/resources/plugins/datatables/dataTables.bootstrap.min.js"></script>
		<script src="#{request.contextPath}/resources/js/tables/mytable.js"></script>
		<script src="#{request.contextPath}/resources/js/array-util.js"></script>
		<script src="#{request.contextPath}/resources/js/date-util.js"></script>
		<script src="weatherAlarmDialog.js"></script>
		<script>
			var weatherAlarm;
			var protectionPanel;
			var weatherWarningId;
			$(function() {
				weatherWarningId = $('#weatherWarningId').val();
				weatherAlarm = new WeatherAlarm();
				protectionPanel = new ProtectionPanel();
			});
			function clickButtonSearch(ele) {
				if (typeof (ele) != "undefined") {
					if (!$(ele).hasClass('equipmentSearchBtn')) {
						$('#lines').children('.equipmentSearchBtn').addClass(
								'equipmentBtn');
						$('.equipmentSearchBtn').removeClass(
								'equipmentSearchBtn');
						$(ele).removeClass('equipmentBtn');
						$(ele).addClass('equipmentSearchBtn');
						var title = ele.title;
						var table = $('#protects').DataTable();
						table.search(title).draw();
					} else {
						$(ele).removeClass('equipmentSearchBtn');
						$(ele).addClass('equipmentBtn');
						var table = $('#protects').DataTable();
						table.search("").draw();
					}
				}
			}
		</script>
	</ui:define>
</ui:composition>